:root{
	--background:#efefef;
	--name-color-a:#111;
	--name-color-b:#111;
	--bak-a: #efefef;
	--bak-b: #efefef;
	--color-a: #111;
	--color-b: #111;
	--date-background:transparent;
	--date-color:#000;
}

.board-comment-list {background:var(--background); padding:20px 0; max-width:600px; margin:0 auto;}

.ss-line {display:flex; padding:12px 20px; gap:12px; font-size:13px; position:relative;}
.ss-line.reply {margin:0 40px;}
.ss-line + .ss-line:before {content:''; width:2px; height:100%; background:#777; position:absolute; top:-50%; left:42px;}
.ss-line:first-of-type:before{top:20px;}
.ss-line.reply:before{ left: 2px; height: 100%;}
.ss-line.reply:after {content:'';height: 2px;width: 16px;background: #777;position: absolute;left: 2px;top: calc(+50% - 2px);}
.ss-line .line-head {min-width:48px;}

.ss-date-line + .ss-line:before {top: 50%;}

.ss-line .avatar-img {border-radius:4px;}
.ss-line.dv-a {background:var(--bak-a);}
.ss-line.dv-b {background:var(--bak-b);}
.ss-line.dv-a .ss-name {color:var(--name-color-a);}
.ss-line.dv-b .ss-name {color:var(--name-color-b);}
.ss-line .line-head {display: flex;gap: 8px;align-items: flex-end; position:relative; z-index:1; align-items: flex-start;}
.ss-line .line-detail {padding:8px 0;}

.ss-line.dv-a .line-detail{ color:var(--color-a);}
.ss-line.dv-b .line-detail{background:var(--bak-b); color:var(--color-b);}

.update_button {position: absolute; right: 20px; bottom: 0;}
.update_menu {bottom:0; right:52px;}

.ss-date-line .date-in {background: var(--date-background);color:var(--date-color); font-weight: bold; padding: 2px 4px; font-size:14px;}